<template>
  <div class="footer">
    <div class="footer-a">票面价是指通过景区指定窗口售卖的纸质门票上标注的价格</div>
    <div class="footer-b">
      <ul class="foo-c">
        <li><span class="iconfont icon-jipiao"></span>机票</li>
        <li><span class="iconfont icon-jiudian"></span>酒店</li>
        <li><span class="iconfont icon-danjiangongyu"></span>公寓</li>
        <li class="more"><span class="iconfont icon-gengduo"></span>更多</li>
      </ul>
      <ul class="foo-d">
        <li><a href="">登录我们</a></li>
        <li><a href="">我的订单</a></li>
        <li><a href="">最近浏览</a></li>
        <li><a href="">关于我们</a></li>
      </ul>
      <p class="foo-e">触屏版&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;电脑版</p>
      <p class="foo-f">Qunar京ICP备05021087意见反馈</p>
    </div>
  </div>
</template>
<script>
  export default {
    name: "HomeFooter"
  }
</script>
<style lang="stylus" scoped>

  .footer{
    .footer-a{
      line-height :.3rem;
      background-color white
      font-size :.12rem;
      text-indent :.1rem;
    }
    .footer-b{
      background-color:#f3f3f3;
      .foo-c{
        display:flex;
        justify-content :center;
        line-height :.4rem;
        li{
          width:.7rem;
          span{
            font-size :.2rem;
          }
          .more{
            border-left :.01rem solid gainsboro;
          }
        }
      }
      .foo-d{
        display :flex;
        padding-bottom .1rem;
        border-bottom:.02rem solid gray;
        li{
          width:.8rem;
          text-align center
        }
      }
      .foo-e{
        line-height :.3rem;
        text-align center
      }
      .foo-f{
        text-align center;
        padding-bottom :.05rem;
        border-bottom :.01rem solid gainsboro;
      }
    }
  }
</style>
